In my last
article, we learn about Sorting list with side
bar in Android(Sorting list
with side bar). Now we see how use multiple fragment
according to available space in device
A fragment is an independent Android
component which can be used by an activity. A fragment encapsulates
functionality so that it is easier to reuse within activities and layouts.
Android Fragments are the user Interface which
represents a part of an activity, in other words you can also say fragments are
the sub-part of an activity.
A
Fragment is a piece of an application's user interface or behaviour that can be
placed in an Activity.
Developer can show multiple fragment in a single activity. You can
manage your fragment according to your
available space in screen.
If you have limited space like phone or handset device.
And if you have extra space then you can show multiple fragment
like this
1. Create an Android project
2. Minimum SDK must be greater than 12
3. Add three layout xml file to show views in
fragment -i. detail_activity
ii. detail_fragment and iii. my_view.
detail_activity.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<fragment
android:id="@+id/detailFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
class="com.example.samplefraagment.DetailFragment" />
</LinearLayout>
detail_fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFF99"
android:orientation="vertical"
android:padding="3dp" >
<TextView
android:id="@+id/display_tv"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text=""
android:textSize="30sp" />
</LinearLayout>
myview.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:layout_marginTop="10sp"
android:id="@+id/myTextview"
android:layout_width="wrap_content"
android:text="Third Fragement"
android:layout_height="wrap_content" />
</LinearLayout>
Create Detail_Fragment class
package com.example.samplefraagment;
import android.annotation.SuppressLint;
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
@SuppressLint("NewApi")
public class DetailFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.detail_fragment, container, false);
return view;
}
// we call this method when button from listfragment is clicked
public void setText(String item) {
TextView view = (TextView) getView().findViewById(R.id.display_tv);
view.setText(item);
}
}
Add another class myFragmentView class
package com.example.samplefraagment;
import android.annotation.SuppressLint;
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
@SuppressLint("NewApi")
public class myFragmentView extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.myview, container, false);
return view;
}
}
Add fragment item in activity_main layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<fragment
android:id="@+id/list_Fragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".32"
class="com.example.samplefraagment.MyListFragment" >
</fragment>
<fragment
android:id="@+id/detail_Fragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".38"
class="com.example.samplefraagment.DetailFragment" >
</fragment>
</LinearLayout>
Create an xml file name, list_fragment.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#CCFF99"
android:orientation="vertical"
android:padding="5dp" >
<Button
android:id="@+id/android_btn_id"
android:layout_width="105sp"
android:layout_height="wrap_content"
android:text="Android" />
<Button
android:id="@+id/ios_btn_id"
android:layout_width="105sp"
android:layout_height="wrap_content"
android:text="IOS" />
<Button
android:id="@+id/windows_btn_id"
android:layout_width="105sp"
android:layout_height="wrap_content"
android:text="Windows" />
</LinearLayout>
Paste following code in MainActivity.class
package com.example.samplefraagment;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.os.Bundle;
public class MainActivity extends Activity implements
MyListFragment.Communicator {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
@SuppressLint("NewApi")
@Override
public void Message(String OS_Name) {
DetailFragment detailfragment = (DetailFragment) getFragmentManager()
.findFragmentById(R.id.detail_Fragment);
if (detailfragment != null && detailfragment.isInLayout()) {
detailfragment.setText(OS_Name);
}
}
}
Create DetialActivity class and paste following code
package com.example.samplefraagment;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.res.Configuration;
import android.os.Bundle;
public class DetailActivity extends Activity {
public static String os_name = "";
@SuppressLint("NewApi")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// check Configuration of device
if (getResources().getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE) {
finish();
return;
}
setContentView(R.layout.detail_activity);
Bundle extras = getIntent().getExtras();
if (extras != null) {
String name = extras.getString(os_name);
DetailFragment detailFragment = (DetailFragment) getFragmentManager()
.findFragmentById(R.id.detailFragment);
detailFragment.setText(name);
}
}
}
Create a class MyListFragment. And follow this code
package com.example.samplefraagment;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.Button;
@SuppressLint("NewApi")
public class MyListFragment extends Fragment implements OnClickListener {
private Communicator communicator;
Button android_btn, ios_btn, windows_btn;
@Override
public void onAttach(Activity activity) {
super.onAttach(activity);
if (activity instanceof Communicator) {
communicator = (Communicator) activity;
} else {
throw new ClassCastException(activity.toString()
+ " must implemenet MyListFragment.Communicator");
}
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.list_fragment, container, false);
// Initialize Views
android_btn = (Button) view.findViewById(R.id.android_btn_id);
ios_btn = (Button) view.findViewById(R.id.ios_btn_id);
windows_btn = (Button) view.findViewById(R.id.windows_btn_id);
// set on click Listeners for buttons
android_btn.setOnClickListener(this);
ios_btn.setOnClickListener(this);
windows_btn.setOnClickListener(this);
return view;
}
// Create Interface
public interface Communicator {
public void Message(String OS_Name);
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.android_btn_id:
updateFragment("Android");
break;
case R.id.ios_btn_id:
updateFragment("IOS");
break;
case R.id.windows_btn_id:
updateFragment("Windows");
break;
}
}
private void updateFragment(String OS_Name) {
communicator.Message(OS_Name);
}
}
Now create a folder in res layout-large-land. And create an activity_main.xml file and now paste following code. This layout will show on tablet or large screen
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<fragment
android:id="@+id/list_Fragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".32"
class="com.example.samplefraagment.MyListFragment" >
</fragment>
<fragment
android:id="@+id/detail_Fragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".38"
class="com.example.samplefraagment.DetailFragment" >
</fragment>
<fragment
android:id="@+id/detail_Fragment2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".30"
class="com.example.samplefraagment.myFragmentView" >
</fragment>
</LinearLayout>
Now create a folder in res layout-large-port. And create an activity_main.xml file and now paste following code
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<fragment
android:id="@+id/list_Fragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".32"
class="com.example.samplefraagment.MyListFragment" >
</fragment>
<fragment
android:id="@+id/detail_Fragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight=".38"
class="com.example.samplefraagment.DetailFragment" >
</fragment>
</LinearLayout>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<fragment
android:id="@+id/list_Fragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
class="com.example.samplefraagment.MyListFragment" >
</fragment>
</LinearLayout>
Tablet with portrait and landscape mode
In landscape mode showing three fragment
Leave Comment